@extends('admin._layout.master')

@section('style')
    <link rel="stylesheet" type="text/css" href="{{ asset('lib/webuploader/0.1.5/webuploader.css') }}" />
@endsection

@section('content')
    <section class="Hui-article-box">
        <nav class="breadcrumb">
            <i class="Hui-iconfont">&#xe67f;</i> 首页
            <span class="c-gray en">&gt;</span> 栏目管理
            <span class="c-gray en">&gt;</span> 修改栏目
            <a class="btn btn-success radius r" style="line-height:1.6em;margin-top:3px" href="javascript:location.replace(location.href);" title="刷新" >
                <i class="Hui-iconfont">&#xe68f;</i>
            </a>
        </nav>
        <div class="pd-20">
            <form id="editForm" class="form form-horizontal" method="post" action="">
                {{ csrf_field() }}
                <input type="hidden" name="id" value="{{ $thisCategory->id }}">
                @if($thisCategory->type == '0')
                    <div class="row cl" id="pCategory">
                            <label class="form-label col-xs-2"><span class="c-red">*</span>父栏目：</label>
                            <div class="formControls col-xs-4">
                                <span class="select-box">
                                    <select name="parent_id" class="select">
                                        <option value="0"
                                                {{ $thisCategory->parent_id == '0' ? 'selected' : ''}}>
                                            顶级栏目
                                        </option>
                                        @foreach($categories as $category)
                                            <option value="{{ $category->id }}"
                                                    {{ $category->id == $thisCategory->parent_id ? 'selected' : ''  }}>
                                                @if(count(explode(',', $category->fullpath)) >= 2)
                                                    {{ str_repeat('&nbsp;&nbsp;', count(explode(',', $category->fullpath))) . '├&nbsp;' }}
                                                @endif
                                                {{ $category->name }}
                                            </option>
                                        @endforeach
                                    </select>
                                </span>
                            </div>
                        </div>
                @endif
                <div class="row cl">
                    <label class="form-label col-xs-2"><span class="c-red">*</span>栏目名：</label>
                    <div class="formControls col-xs-4">
                        <input type="text" class="input-text" name="name" value="{{ $thisCategory->name }}"
                        datatype="s1-8" nullmsg="请输入栏目名！" errormsg="栏目名为1-8个字符！">
                    </div>
                </div>
                <div class="row cl">
                    <label class="form-label col-xs-2"><span class="c-red">*</span>类型：</label>
                    <div class="formControls col-xs-4">
                        {{ $thisCategory->getType($thisCategory->type) }}
                    </div>
                </div>
                <div class="row cl">
                    <label class="form-label col-xs-2"><span class="c-red">*</span>显示位置：</label>
                    <div class="formControls col-xs-4">
                        @foreach($showPositions as $showPosition)
                            <label>
                                <input type="checkbox" value="{{ $showPosition->id }}" name="position[]"
                                        {{ $showPosition->isChecked ? 'checked' : '' }}>
                                {{ $showPosition->remark }}
                            </label>
                        @endforeach
                    </div>
                </div>
                <div class="row cl">
                    <label class="form-label col-xs-2"><span class="c-red">*</span>是否显示：</label>
                    <div class="formControls col-xs-4">
                        <input type="radio" id="radio-1" name="is_nav" value="0">
                        <label for="radio-1">不显示</label>
                        <input type="radio" id="radio-2" name="is_nav" value="1" class="ml-20" checked>
                        <label for="radio-2">显示</label>
                    </div>
                </div>
                <div class="row cl">
                    <label class="form-label col-xs-2"><span class="c-red">*</span>栏目排序值：</label>
                    <div class="formControls col-xs-4">
                        <input type="text" class="input-text" name="sort" value="{{ $thisCategory->sort }}"
                               datatype="n" nullmsg="请输入栏目排序值！" errormsg="请输入正确的栏目排序值！">
                    </div>
                </div>
                <div class="row cl">
                    <label class="form-label col-xs-2">缩略图：</label>
                    <div class="formControls col-xs-6">
                        <div id="uploader" class="wu-example">
                            <div id="thelist1" class="uploader-list"></div>
                            <div class="btns">
                                <div id="picker1">选择图片</div>
                                <button id="ctlBtn1" class="btn btn-default" type="button">开始上传</button>
                                @if(!empty($thisCategory->thumbnail))
                                    <button id="look" class="btn btn-primary radius ml-20" type="button">查看原缩略图</button>
                                @endif
                            </div>
                        </div>
                        <input type="hidden" id="thumbnail" name="thumbnail">
                    </div>
                </div>
                @if($thisCategory->type == '1')
                    <div class="row cl" id="content">
                        <label class="form-label col-xs-2"><span class="c-red">*</span>栏目内容：</label>
                        <div class="formControls col-xs-8">
                            <script id="editor" name="content" type="text/plain" style="width:100%;height:400px;">
                                {!! $thisCategory->content !!}
                            </script>
                        </div>
                    </div>
                @endif
                <div class="row cl">
                    <label class="form-label col-xs-2">路由：</label>
                    <div class="formControls col-xs-4">
                        <input type="text" class="input-text" name="route" value="{{ $thisCategory->route }}">
                    </div>
                </div>
                <div class="row cl">
                    <div class="col-xs-8 col-xs-offset-2">
                        <button id="submit" class="btn btn-primary radius" type="button"><i class="Hui-iconfont">&#xe632;</i> 保存并提交</button>
                    </div>
                </div>
            </form>
        </div>
    </section>
@endsection

@if(!empty($thisCategory->thumbnail))
    <div id="showThumbnail" style="padding: 20px;" class="hide">
        <img src="{{ url('upload/' . $thisCategory->thumbnail_s) }}" style="width: 300px;height: 300px;" class="radius">
    </div>
@endif

@section('javascript')
    <script type="text/javascript" src="{{ asset('lib/webuploader/0.1.5/webuploader.js') }}"></script>
    <script type="text/javascript" src="{{ asset('lib/ueditor/1.4.3/ueditor.config.js') }}"></script>
    <script type="text/javascript" src="{{ asset('lib/ueditor/1.4.3/ueditor.all.min.js') }}"> </script>
    <script type="text/javascript" src="{{ asset('lib/ueditor/1.4.3/lang/zh-cn/zh-cn.js') }}"></script>
    <script type="text/javascript">

        var ue = UE.getEditor('editor');

        var uploader1 = WebUploader.create({
            swf: '{{ asset('lib/webuploader/0.1.5/Uploader.swf') }}',
            server: '{{ asset('lib/webuploader/0.1.5/server/fileupload.php') }}',
            pick: {id: '#picker1', multiple: false},
            chunked: true,
            chunkSize: 1024 * 1024,
            formData: {guid: 'yamete1'},
            fileNumLimit: 1,
            resize: false,
            accept: {
                title: '图片',
                extensions: 'gif,jpg,jpeg,bmp,png',
                mimeTypes: 'image/*'
            }
        });
        uploader1.on( 'fileQueued', function( file ) {
            var $list = $('#thelist1');
            $list.append( '<div id="' + file.id + '" class="item">' +
                '<h4 class="info" style="color: #2980B9;">' + file.name + '</h4>' +
                '<p class="state" style="color: #16A085;">等待上传...</p>' +
                '</div>' );
        });
        uploader1.on( 'uploadProgress', function( file, percentage ) {
            var $li = $( '#'+file.id ),
                $percent = $li.find('.progress-box .sr-only');
            // 避免重复创建
            if ( !$percent.length ) {
                $percent = $('<div class="progress-box"><span class="progress-bar radius"><span class="sr-only" style="width:0%"></span></span></div>').appendTo( $li ).find('.sr-only');
            }
            $li.find(".state").text("上传中");
            $percent.css( 'width', percentage * 100 + '%' );
        });
        uploader1.on( 'uploadSuccess', function( file, response ) {
            $('#thumbnail').val(response.name);
            $( '#'+file.id ).addClass('upload-state-success').find(".state").text("已上传");
        });
        uploader1.on( 'uploadError', function( file ) {
            $( '#'+file.id ).addClass('upload-state-error').find(".state").text("上传出错");
        });
        uploader1.on( 'uploadComplete', function( file ) {
            $( '#'+file.id ).find('.progress-box').fadeOut();
        });

        $(function () {

            $('#editForm').Validform({
                btnSubmit: '#submit',
                tiptype: function (msg) {
                    layer.alert(msg, {title: '提示信息'});
                },
                tipSweep: true,
                ajaxPost: true,
                ignoreHidden: true,
                callback: function (data) {
                    if (data.status == 'y') {
                        location.href = "{{ url('admin/category') }}";
                    }
                }
            });

            $('#ctlBtn1').click(function () {
                uploader1.upload();
            });

            $('#look').click(function () {
                layer.open({
                    type: 1,
                    title: '原缩略图',
                    content: $('#showThumbnail')
                });
            });

        });
    </script>
@endsection